<!--
 * @Descripttion: 平台公告
 * @version: v1.0.0
 * @Author: 穆宏宇
 * @Date: 2021-01-26 13:09
 * @LastEditors: Administrator
 * @LastEditTime: 2021-01-26 13:09
-->
<template>
	<div class="row">
		<!-- <p class="title">优选品牌<span>更多 ></span></p> -->
		<p class="title">优选品牌</p>
		<div class="companyView">
			<img src="https://emall.epec.com/_nuxt/img/brand.93f078e.png" class="compLogo">
			<div class="right">
				<div class="item" v-for="item in list" @click="goNav(item)">
					<img :src="item.pic" />
				</div>
			</div>
			<!-- <div class="right" v-else>
				<div class="item">
					<img src="https://static.epec.com/productFile/homePage/6924db46-8eb3-477f-a463-9388ffe9aa46.png" />
				</div>
				<div class="item">
					<img src="https://static.epec.com/productFile/homePage/f478888d-3652-42f8-b896-ae9db2f93ceb.png" />
				</div>
				<div class="item">
					<img src="https://static.epec.com/productFile/homePage/6924db46-8eb3-477f-a463-9388ffe9aa46.png" />
				</div>
				<div class="item">
					<img src="https://static.epec.com/productFile/homePage/f478888d-3652-42f8-b896-ae9db2f93ceb.png" />
				</div>
				<div class="item">
					<img src="https://static.epec.com/productFile/homePage/f478888d-3652-42f8-b896-ae9db2f93ceb.png" />
				</div>
				<div class="item">
					<img src="https://static.epec.com/productFile/homePage/6924db46-8eb3-477f-a463-9388ffe9aa46.png" />
				</div>
				<div class="item">
					<img src="https://static.epec.com/productFile/homePage/f478888d-3652-42f8-b896-ae9db2f93ceb.png" />
				</div>
				<div class="item">
					<img src="https://static.epec.com/productFile/homePage/6924db46-8eb3-477f-a463-9388ffe9aa46.png" />
				</div>
				<div class="item">
					<img src="https://static.epec.com/productFile/homePage/6924db46-8eb3-477f-a463-9388ffe9aa46.png" />
				</div>
				<div class="item">
					<img src="https://static.epec.com/productFile/homePage/f478888d-3652-42f8-b896-ae9db2f93ceb.png" />
				</div>
				<div class="item">
					<img src="https://static.epec.com/productFile/homePage/6924db46-8eb3-477f-a463-9388ffe9aa46.png" />
				</div>
				<div class="item">
					<img src="https://static.epec.com/productFile/homePage/f478888d-3652-42f8-b896-ae9db2f93ceb.png" />
				</div>
			</div> -->
		</div>
	</div>
</template>

<script>
	import {
		queryList
	} from "@/api/mall.api";


	export default {
		name: "companyView",
		components: {},
		props: {},
		data() {
			return {
				list: [],
				env: process.env.NODE_ENV === 'development' ? 'dev' : 'pro',
			}
		},
		computed: {},
		watch: {},
		filters: {},
		created() {

		},
		mounted() {
			this.getList();
		},
		methods: {
			getList() {
				var that = this;
				queryList().then(res => {
					that.list = res;
				})
			},
			goNav(item) {
				this.$router.push({
					path: "/newSearch?pinpaiId=" + item.id + '&show=0'
				})
			},
		},
	}
</script>

<style scoped lang="scss">
	.floor {
		width: 100%;
		overflow: hidden;

		.row {
			width: 100%;
			overflow: hidden;

			.title {
				background-image: url(../../../assets/mall-images/dot.png);
				background-repeat: no-repeat;
				background-size: 30px 30px;
				text-indent: 40px;
				background-position: 0 5px;
				height: 40px;
				line-height: 40px;
				font-weight: bolder;
				font-size: 22px;
				margin: 20px 0px;

				span {
					float: right;
					margin-right: 10px;
					font-weight: normal;
					font-size: 14px;
					cursor: pointer;
				}
			}
		}

		.companyView {
			width: 100%;
			overflow: hidden;

			.compLogo {
				width: 400px;
				height: 450px;
				float: left;
			}

			.right {
				width: 800px;
				height: 450px;
				float: left;
				overflow: hidden;

				.item {
					width: 200px;
					height: 150px;
					float: left;
					cursor: pointer;
					border: 1px solid transparent;
					background: #fff;

					img {
						width: 70%;
						height: 70%;
						display: block;
						margin: 13% auto;
					}
				}

				.item:nth-child(2),
				.item:nth-child(4),
				.item:nth-child(5),
				.item:nth-child(7),
				.item:nth-child(10),
				.item:nth-child(12) {
					background: #ccc;
				}

				.item:hover {
					border: 1px solid #FF4D4F;
				}
			}
		}

	}
</style>
